<script setup lang="ts">


// import {ref} from "vue";


const props = defineProps({
        textInfo: {
            type: [Object, String]
        }
    }
)
let baseUrl = 'http://192.168.5.120:8090'
const onClickLeft = () => history.back();
// 文章收藏，收藏了放到pinna里
// const store=indexPinna()

// function collect(){
//     if (props.textInfo.collect==0){
//         store.collect=1
//         console.log(store.collect)
//     }
// }
</script>

<template>
    <van-nav-bar
        left-text="文章详情"
        left-arrow
        @click-left="onClickLeft"
    />
    <div class="whole">
        <h2>{{ props.textInfo.title }}</h2>
        <div class="head">
            <div class="left">
                <img :src="baseUrl+props.textInfo.avatar"
                     alt="头像">
                <div class="name">
                    <h3>{{ props.textInfo.author }}</h3>
                    <div class="time">{{ props.textInfo.sendTime }}</div>
                </div>
            </div>
            <button>
                <van-icon name="star-o"/>
                收藏
            </button>
        </div>
        <div class="content">
            <p v-html="props.textInfo.content">

            </p>
        </div>
    </div>
</template>

<style scoped lang="less">
.whole {
  width: 90%;
  margin: 0 auto;

  .head {
    display: flex;
    justify-content: space-between;

    .left {
      width: 55%;
      display: flex;
      justify-content: space-between;

      img {
        width: 28%;
        height: 7vh;
        border-radius: 50%;
      }

      .name {
        h3 {
          margin: 0 0 9px;
        }

        .time {
          color: #858585FF;
        }
      }
    }

    button {
      border: none;
      border-radius: 2px;
      background-color: #38A0FB;
      height: 4vh;
      width: 20%;
      color: white;
    }

  }
}


</style>